<template>
  <div>
    <div class="top">
      <el-input v-model="adminId" placeholder="输入管理员ID" style="width:220px" />
      <el-button type="primary" class="button" :icon="Search" @click="find">查找</el-button>
    </div>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="id" label="日志ID" />
      <el-table-column prop="adminId" label="管理员ID" />
      <el-table-column prop="requestId" label="请求ID" />
      <el-table-column prop="group" label="API分组" />
      <el-table-column prop="method" label="API方法" />
      <el-table-column prop="gmtCreate" label="操作时间">
        <template #default="scope">
          {{new Date(scope.row.gmtCreate).friendTime()}}
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <Paging @pageChang='pageChang' v-bind="pageData"></Paging>
  </div>
</template>

<script>
import { post } from "@/utils/http";
import { Search } from '@element-plus/icons-vue';
import Paging from "@/components/Paging/Paging.vue";

export default {
  components: {
    Paging
  },
  data() {
    return {
      adminId: "", //管理员ID
      tableData: [], //列表数据
      pageData: {
        total: 0, //总条数
        currentPage: 1,  //页数
        pageSize: 10  //每页条数
      }
    }
  },
  setup() {
    return {
      Search
    }
  },
  methods: {
    // 初始化数据
    initData() {
      post({ _gp: 'admin.log', _mt: 'list', targetAdminId: this.adminId, page: this.pageData.currentPage, limit: this.pageData.pageSize }).then(res => {
        if (200 == res.errno) {
          this.pageData.total = res.data.total //赋值总条数
          this.tableData = res.data.items
        } else {
          ElMessage.warning(res.errmsg)
        }
      })
    },
    // 查找
    find() {
      this.initData()
    },
    // 页数
    pageChang(e) {
      Object.assign(this.pageData, e) //解构并赋值
      this.initData()
    }
  },
  created() {
    this.initData()
  }
}
</script>

<style lang="less" scoped>
.top {
  margin-bottom: 20px;
}
.button {
  margin-left: 10px;
}
</style>